<template>
	<view class="pay_list_box">
	  <radio-group @change="radioChange">
		  <view class="money">
		  	<text class="title">支付金额</text>
			<text class="mon">￥{{money}}.00</text>
		  </view>
	    <label class="pay_list">
	      <view class="l_box">
	        <view class="top">
	          <image class="t_img" src="/static/signup/微信方.png" mode=""></image>
	          <view>微信</view>
	        </view>
	      </view>
	      <view class="r_radio">
	        <radio value="1" color="#44bb53" style="transform:scale(0.8)"/>
	      </view>
	    </label>
	    <label class="pay_list">
	      <view class="l_box">
	        <view class="top">
	          <image class="t_img1" src="/static/signup/支付平台-支付宝.png" mode=""></image>
	          <view>支付宝</view>
	        </view>
	      </view>
	      <view class="r_radio">
	        <radio value="2" color="#44bb53" style="transform:scale(0.8)"/>
	      </view>
	    </label>
	  </radio-group>
	  <view class="zf_btn" @click="pay">支付</view>
	</view>

</template>

<script>
  // export default{
  //   data(){
  //     return{
  //       imgs:[],
  //       pay_type:0,
  //       id:0,
  //       info:[],
		// money:1899
  //     }
  //   },
  //   onLoad(response) {
  //     this.id = response.id
  //     this.servicesInfo()
  //   },
  //   methods:{
  //     radioChange(e){
  //       // 获取用选择的支付方式
  //       this.pay_type = e.detail.value
  //     },
  //     //一、获取订单信息
  //     servicesInfo:function(){
  //       var that = this;
  //       // 请求订单信息接口
  //       that.$http.post("User/servicesInfo",{'id':that.id})
  //       .then(function (response) {
  //         that.info = response.data;
  //         console.log(response);
  //       });
  //     },
      
  //     //二、获取服务信息和支付配置信息
  //     pay:function(){
  //       var that = this;
  //       if(that.pay_type == 0){
  //         uni.showToast({
  //           title:"请选择支付方式",
  //           icon:"none"
  //         })
  //         return;
  //       }
  //       var url;
  //      // 1 微信支付；2 支付宝支付
  //       if(that.pay_type == 1){
  //         url = 'Order/wxpay';
  //       }else if(that.pay_type == 2){
  //         url = 'Order/alipay';
  //       }
  //       // 请求服务信息和支付配置信息
  //       that.$http.post(url,{'id':that.id,type:that.pay_type,'price':that.info.pay_price,'order_sn':that.info.order_sn}).then(function(response){
  //         console.log(response);
  //         // 调用支付
  //         that.appPay(response.data,that.pay_type);
  //       });
  //     },
  //     // 三、支付
  //     appPay:function(data, type){
  //       var that =this;
  //       let pay_type = type == 1 ? 'wxpay' : 'alipay'
  //       // 发起支付
  //       uni.requestPayment({
  //         provider: pay_type,
  //         orderInfo: data.order_info, //微信、支付宝订单数据
  //         success: (res) => {
  //           // 支付成功，改变订单状态
  //           that.updateOrder(data.out_trade_no,type)
  //         },
  //         fail: (err) => {
  //           uni.showToast({
  //             title:'支付失败',
  //             'icon':'none'
  //           })
  //         }
  //       })
  //     },
  //     //四、修改务订单状态
  //     updateOrder:function(order_no,type){
  //       var that = this;
  //       that.$http.post('Order/updateOrder',{order_no:order_no})
  //       .then(function(response) {
  //         uni.showToast({
  //           title:"支付成功",
  //           icon:'none',
  //           duration:2000
  //         })
          
  //       })
  //     },
  //   }
  // }
</script>
<style >
	.money {
			margin-top: -60rpx;
			margin-bottom: 40rpx;
	}
	.money .title{
		margin-left: 100rpx;
	}
	.money .mon{
		font-size: 50rpx;
		color: red;
		margin-left: 100rpx;
	}
  .zaixian{
    padding-bottom: 100rpx;
    border-top: 1px solid #ebebeb;
    }
    .code{
      padding: 0 20rpx;
      display: flex;
	  }
      .shoukuanma{
        text-align: center;
        width: 50%;
        height: 200rpx;
		}
        .type{
          font-size: 30rpx;
          color: #3b3b3b;
        }
        .ty_img{
          width: 200rpx;
          height: 200rpx;
        }
    .pay_list_box{
      margin-top: 100rpx;
	  }
      .yinhangka{
        font-size: 30rpx;
        color: #3b3b3b;
        padding: 0 20rpx;
        display: flex;
        height: 100rpx;
        align-items: center;
        justify-content: space-between;
        border-bottom: 1px solid #ebebeb;
		}
        .y_left{
          display: flex;
		  }
          .name{
            padding-right: 20rpx;
          }
      .pay_list{
        border-bottom: 1px solid #ebebeb;
        padding: 0 20rpx;
        height: 100rpx;
        align-items: center;
        display: flex;
        justify-content: space-between;
		}
        .l_box{
          height: 100rpx;
		  }
          .top{
            height: 100rpx;
            display: flex;
            height: 100rpx;
            align-items: center;
            font-size: 30rpx;
            color: #3b3b3b;
			}
            .t_img{
              padding-right: 20rpx;
              width: 100rpx;
              height: 50rpx;
			  margin-left: 10rpx;
            }
            .t_img1{
              padding-right: 20rpx;
              width: 100rpx;
              height: 50rpx;
            }
           
    .pingzheng{
      margin-top: 30rpx;
	  }
      .content{
        display: flex;
        align-items: center;
        padding: 0 20rpx;
        height: 200rpx;
		}
        .shangchuan{
          color: #454545;
          font-size: 30rpx;
        }
        .sc_img{
          padding-left: 20rpx;
          width: 200rpx;
          height: 200rpx;
          border-radius: 5px;
        }
      
      .pz_pic{
        margin-top: 30rpx;
        padding: 0 20rpx;
		}
        .pz_img{
          width: 100%;
          height: 300rpx;
        }
    .zf_btn{
      margin: 100rpx auto 0;
      background-color: #00BFFF;
      width: 650rpx;
      height: 90rpx;
      font-size: 36rpx;
      color: #FFF;
      line-height: 90rpx;
      text-align: center;
      border-radius: 45rpx;
    }
  
</style>
